<!--统计数据细节页面-->
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<div th:replace="fragment/header::head"></div>
<body>
<div th:replace="fragment/sidebar::side"></div>
<!--统计图表-->
<div class="main-panel">
    <div class="content-wrapper">
        <div class="row">
            <div id="main" style="width: 800px;height:400px;" class="col-lg-6">
                <script type="text/javascript">
                    // 基于准备好的dom，初始化echarts实例
                    var myChart = echarts.init(document.getElementById('main'));

                    // 指定图表的配置项和数据
                    option = {
                        title: {
                            text: '会话量占比'
                        },
                        tooltip: {
                            trigger: 'item'
                        },
                        legend: {
                            top: '5%',
                            left: 'center'
                        },
                        series: [
                            {
                                name: '会话量占比',
                                type: 'pie',
                                radius: ['40%', '70%'],
                                avoidLabelOverlap: false,
                                itemStyle: {
                                    borderRadius: 10,
                                    borderColor: '#fff',
                                    borderWidth: 2
                                },
                                label: {
                                    show: false,
                                    position: 'center'
                                },
                                emphasis: {
                                    label: {
                                        show: true,
                                        fontSize: '40',
                                        fontWeight: 'bold'
                                    }
                                },
                                labelLine: {
                                    show: false
                                },
                                data: [
                                    {value: 2016, name: '有效会话量'},
                                    {value: 498, name: '剩余会话量'},
                                    {value: 30, name: '未解决会话量'}
                                ]
                            }
                        ]
                    };

                    // 使用刚指定的配置项和数据显示图表。
                    myChart.setOption(option);
                </script>

        </div>
        </div>
    </div>
    <!--表格总览-->
            <div class="row">
                <div class="col-md-12 grid-margin">
                    <div class="card">
                        <div class="card-body">
                            <h2 class="font-weight-medium" style="line-height:90px">工作量统计总览</h2>
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th>id</th>
                                        <th>姓名</th>
                                        <th>总消息量</th>
                                        <th>总会话量</th>
                                        <th>有效会话</th>
                                        <th>剩余会话量</th>
                                        <th>总会话时长</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody>
                                <tr th:each="workloadstatistics , rowInfo : ${list}">
                                    <td th:text="${rowInfo.count}"></td>
                                    <td th:text="${workloadstatistics.getNickname()}"></td>
                                    <td th:text="${workloadstatistics.getTotalmessagecount()}"></td>
                                    <td th:text="${workloadstatistics.getTotalsessioncount()}"></td>
                                    <td th:text="${workloadstatistics.getTotaleffectivesessioncount()}"></td>
                                    <td th:text="${workloadstatistics.getTotalendsessioncount()}"></td>
                                    <td th:text="${workloadstatistics.getTotalsessiontime()}"></td>
                                    <td >
                                        <a th:href="@{/workloadStatistics/del(id=${workloadstatistics.getId()},current=${#request.getParameter('current')},size=10)}">删除</a>
                                        <a th:href="@{/workloadStatistics/update(id=${workloadstatistics.getId()},current=${#request.getParameter('current')},size=10)}">修改</a>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                            <a th:href="@{/workloadStatistics/workloadstatistics(current=1,size=10)}">首页</a>
                            <a th:href="@{/workloadStatistics/workloadstatistics(current=${i},size=10)}" th:each="i : ${#numbers.sequence(1,pageCount)}" ><span th:text="${i}" style="border: 1px solid #e3e3e3; height: 16px;width: 16px;text-align: center;vertical-align: middle;padding-left: 5px;padding-right: 5px;margin-left: 10px">1</span></a>
                            <a th:href="@{/workloadStatistics/workloadstatistics(current=${pageCount},size=10)}">尾页</a>


                        </div>
                    </div>
                </div>
            </div>
</div>
<div th:replace="fragment/footer::foot"></div>
</body>


